import 'package:flutter/material.dart';
import 'package:happy_elf_app/apis/home.dart';
import 'package:happy_elf_app/store/config.dart';
import 'package:happy_elf_app/store/home.dart';
import 'package:happy_elf_app/utils/adaption.dart';
import 'package:happy_elf_app/utils/color.dart';
import 'package:happy_elf_app/utils/globalKey.dart';

final HomeDataProvider = Provider.of<HomeData>(
  Global.navigatorKey.currentContext!,
  listen: false,
);

class tipModal {
  static late Function success; // 回掉
  static dynamic buildContext;
  static bool isModel = false;
  static Function? setModalState; // 更新
  static Map step = {};

  static int check = 0;
  static int page = 0;
  static List data = []; // 放弃的任务
  static String selectedStepId = '';

  static init({required Function callBack, required context, required item}) {
    success = callBack;
    buildContext = context;
    step = item;
    isModel = false;
    print('z走到这里了$step');
    getGiveUpTask();
    model(buildContext);
  }

  static void getGiveUpTask() async {
    //
    String targetId = HomeDataProvider.target['id'].toString();
    var res = await Home().getgiveUp(targetId);
    if (res['code'] == 200) {
      data = res['data'];
    }
  }

  static void onStepTap(step) {}

  static model(buildContext) {
    if (isModel) return;
    isModel = true;

    showDialog(
        barrierDismissible: false, // 禁用点击空白处关闭对话框
        context: buildContext,
        builder: (BuildContext context) {
          return StatefulBuilder(builder: (context, setSelfState) {
            setModalState = setSelfState;
            return UnconstrainedBox(
                child: ClipRRect(
              borderRadius: BorderRadius.circular(20.px),
              child: Container(
                padding: EdgeInsets.symmetric(horizontal: 24, vertical: 16),
                width: 340,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(20.px),
                ),
                child: page == 0
                    ? Column(
                        children: [
                          Stack(
                            children: [
                              Container(
                                alignment: Alignment.centerRight,
                                child: Image.network(
                                  step['img'],
                                  width: 240,
                                ),
                              ),
                              Container(
                                width: 120,
                                padding: EdgeInsets.all(12),
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(6),
                                    color: Color.fromRGBO(255, 255, 255, 0.2),
                                    border: Border.all(
                                        width: 2.px,
                                        color: hexColor('#cccccc'))),
                                child: Text('我发现你已经3次放弃任务啦,请问发生了什么吗',
                                    style: TextStyle(fontSize: 13)),
                              )
                            ],
                          ),
                          SizedBox(height: 24),
                          GestureDetector(
                            onTap: () {
                              check = 1;
                              setModalState!(() {});
                            },
                            child: Container(
                              decoration: BoxDecoration(
                                  color: hexColor(
                                      check == 1 ? '#e9614d' : '#ffffff'),
                                  boxShadow: [
                                    BoxShadow(
                                      color: Colors.grey.withOpacity(0.5),
                                      spreadRadius: 2,
                                      blurRadius: 5,
                                      offset: const Offset(0, 3),
                                    ),
                                  ],
                                  borderRadius: BorderRadius.circular(40)),
                              child: Row(
                                children: [
                                  Container(
                                      alignment: Alignment.centerRight,
                                      width: 80,
                                      child: Text(
                                        '太难了',
                                        style: TextStyle(
                                            color: hexColor(check == 1
                                                ? '#ffffff'
                                                : '#666666')),
                                      )),
                                  Container(
                                    margin:
                                        EdgeInsets.only(left: 24, right: 24),
                                    width: 1.px,
                                    height: 36,
                                    decoration: BoxDecoration(
                                      color: hexColor('#cccccc'),
                                      boxShadow: [
                                        BoxShadow(
                                          color: Colors.grey.withOpacity(0.3),
                                          spreadRadius: 0,
                                          blurRadius: 3,
                                          offset: const Offset(-3, 0),
                                        ),
                                      ],
                                    ),
                                  ),
                                  Container(
                                      alignment: Alignment.center,
                                      width: 120,
                                      child: Text(
                                        '简化任务',
                                        style: TextStyle(
                                            color: hexColor(check == 1
                                                ? '#ffffff'
                                                : '#666666')),
                                      )),
                                ],
                              ),
                            ),
                          ),
                          SizedBox(height: 24),
                          GestureDetector(
                            onTap: () {
                              check = 2;
                              setModalState!(() {});
                            },
                            child: Container(
                              decoration: BoxDecoration(
                                  color: hexColor(
                                      check == 2 ? '#e9614d' : '#ffffff'),
                                  boxShadow: [
                                    BoxShadow(
                                      color: Colors.grey.withOpacity(0.5),
                                      spreadRadius: 2,
                                      blurRadius: 5,
                                      offset: const Offset(0, 3),
                                    ),
                                  ],
                                  borderRadius: BorderRadius.circular(40)),
                              child: Row(
                                children: [
                                  Container(
                                      alignment: Alignment.centerRight,
                                      width: 80,
                                      child: Text('太无聊了',
                                          style: TextStyle(
                                              color: hexColor(check == 2
                                                  ? '#ffffff'
                                                  : '#666666')))),
                                  Container(
                                    margin:
                                        EdgeInsets.only(left: 24, right: 24),
                                    width: 1.px,
                                    height: 36,
                                    decoration: BoxDecoration(
                                      color: hexColor('#cccccc'),
                                      boxShadow: [
                                        BoxShadow(
                                          color: Colors.grey.withOpacity(0.3),
                                          spreadRadius: 0, // 阴影扩散半径设为0，避免向四周扩散
                                          blurRadius: 3, // 模糊半径，控制阴影的模糊程度
                                          offset: const Offset(
                                              -2, 0), // 水平向左偏移2px，垂直无偏移
                                        ),
                                      ],
                                    ),
                                  ),
                                  Container(
                                      alignment: Alignment.center,
                                      width: 120,
                                      child: Text('趣味化任务',
                                          style: TextStyle(
                                              color: hexColor(check == 2
                                                  ? '#ffffff'
                                                  : '#666666')))),
                                ],
                              ),
                            ),
                          ),
                          SizedBox(height: 24),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              GestureDetector(
                                child: Container(
                                  padding: EdgeInsets.symmetric(
                                      horizontal: 30.px, vertical: 8.px),
                                  decoration: BoxDecoration(
                                      border: Border.all(
                                          width: 1, color: hexColor('#cccccc')),
                                      color: hexColor('#ffffff'),
                                      borderRadius:
                                          BorderRadius.circular(10.px)),
                                  child: Text(
                                    '关闭',
                                    style: TextStyle(
                                        fontSize: 14,
                                        color: hexColor('#333333')),
                                  ),
                                ),
                                onTap: () {
                                  check = 0;
                                  success();
                                },
                              ),
                              SizedBox(width: 32),
                              GestureDetector(
                                child: Container(
                                  padding: EdgeInsets.symmetric(
                                      horizontal: 30.px, vertical: 8.px),
                                  decoration: BoxDecoration(
                                      border: Border.all(
                                          width: 1, color: hexColor('#cccccc')),
                                      color: hexColor('#ffffff'),
                                      borderRadius:
                                          BorderRadius.circular(10.px)),
                                  child: Text(
                                    '确定',
                                    style: TextStyle(
                                        fontSize: 14,
                                        color: hexColor('#333333')),
                                  ),
                                ),
                                onTap: () {
                                  if (check == 0) {
                                    success();
                                  } else {
                                    page = 1;
                                    check = 0;
                                    setModalState!(() {});
                                  }
                                },
                              ),
                            ],
                          )
                        ],
                      )
                    : Column(
                        children: [
                          Container(
                            height: 100,
                            // padding: const EdgeInsets.symmetric(horizontal: 16),
                            child: SingleChildScrollView(
                              physics: const BouncingScrollPhysics(),
                              child: Column(
                                children: data.map((step) {
                                  // 判断是否为选中状态
                                  final isSelected =
                                      step['stepId'] == selectedStepId;
                                  return GestureDetector(
                                    onTap: () => onStepTap(step),
                                    child: Container(
                                      // 每个步骤项的样式
                                      margin: const EdgeInsets.only(bottom: 12),
                                      padding: const EdgeInsets.symmetric(
                                          horizontal: 12, vertical: 6),
                                      decoration: BoxDecoration(
                                        color: isSelected
                                            ? const Color(0xFFFF5252)
                                            : Colors.white,
                                        borderRadius: BorderRadius.circular(20),
                                        border: Border.all(
                                          color: isSelected
                                              ? const Color(0xFFFFB6AC)
                                              : const Color(0x20000000),
                                          width: 1,
                                        ),
                                        boxShadow: isSelected
                                            ? [
                                                const BoxShadow(
                                                  color: Color(0x0C000000),
                                                  blurRadius: 2,
                                                  offset: Offset(0, 2),
                                                )
                                              ]
                                            : null,
                                      ),
                                      child: Text(
                                        step['stepName'],
                                        style: TextStyle(
                                          color: isSelected
                                              ? Colors.white
                                              : const Color(0xFF333333),
                                          fontSize: 16,
                                          height: 1.5,
                                        ),
                                      ),
                                      // Row(
                                      //   crossAxisAlignment:
                                      //       CrossAxisAlignment.start,
                                      // children: [
                                      // 步骤序号（这里可以根据需求调整显示逻辑，示例用索引+1）
                                      // Text(
                                      //   "${data.indexOf(step) + 1})",
                                      //   style: TextStyle(
                                      //     color: isSelected
                                      //         ? Colors.white
                                      //         : const Color(0xFF333333),
                                      //     fontSize: 16,
                                      //     fontWeight: FontWeight.w500,
                                      //   ),
                                      // ),
                                      // const SizedBox(width: 8),
                                      // 步骤内容（自动换行）

                                      // ],
                                      // ),
                                    ),
                                  );
                                }).toList(),
                              ),
                            ),
                          ),
                          SizedBox(height: 24),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              GestureDetector(
                                child: Container(
                                  padding: EdgeInsets.symmetric(
                                      horizontal: 30.px, vertical: 8.px),
                                  decoration: BoxDecoration(
                                      border: Border.all(
                                          width: 1, color: hexColor('#cccccc')),
                                      color: hexColor('#ffffff'),
                                      borderRadius:
                                          BorderRadius.circular(10.px)),
                                  child: Text(
                                    check == 1 ? '简化任务' : '增加难度',
                                    style: TextStyle(
                                        fontSize: 14,
                                        color: hexColor('#333333')),
                                  ),
                                ),
                                onTap: () {},
                              ),
                              SizedBox(width: 32),
                              GestureDetector(
                                child: Container(
                                  padding: EdgeInsets.symmetric(
                                      horizontal: 30.px, vertical: 8.px),
                                  decoration: BoxDecoration(
                                      color: hexColor('#e9614d'),
                                      border: Border.all(
                                          width: 1, color: hexColor('#cccccc')),
                                      borderRadius:
                                          BorderRadius.circular(10.px)),
                                  child: Text(
                                    check == 1 ? '拆分任务' : '趣味化',
                                    style: TextStyle(
                                        fontSize: 14,
                                        color: hexColor('#ffffff')),
                                  ),
                                ),
                                onTap: () {},
                              ),
                            ],
                          ),
                          SizedBox(height: 24),
                          Container(
                            height: 100,
                          ),
                          SizedBox(height: 24),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              GestureDetector(
                                child: Container(
                                  padding: EdgeInsets.symmetric(
                                      horizontal: 56.px, vertical: 8.px),
                                  decoration: BoxDecoration(
                                      border: Border.all(
                                          width: 1, color: hexColor('#cccccc')),
                                      color: hexColor('#ffffff'),
                                      borderRadius:
                                          BorderRadius.circular(10.px)),
                                  child: Text(
                                    '关闭',
                                    style: TextStyle(
                                        fontSize: 14,
                                        color: hexColor('#333333')),
                                  ),
                                ),
                                onTap: () {
                                  page = 0;
                                  check = 0;
                                  success();
                                },
                              ),
                              SizedBox(width: 12),
                              GestureDetector(
                                child: Container(
                                  padding: EdgeInsets.symmetric(
                                      horizontal: 30.px, vertical: 8.px),
                                  decoration: BoxDecoration(
                                      border: Border.all(
                                          width: 1, color: hexColor('#cccccc')),
                                      color: hexColor('#ffffff'),
                                      borderRadius:
                                          BorderRadius.circular(10.px)),
                                  child: Text(
                                    '重新生成',
                                    style: TextStyle(
                                        fontSize: 14,
                                        color: hexColor('#333333')),
                                  ),
                                ),
                                onTap: () {
                                  success();
                                },
                              ),
                              SizedBox(width: 12),
                              GestureDetector(
                                child: Container(
                                  padding: EdgeInsets.symmetric(
                                      horizontal: 56.px, vertical: 8.px),
                                  decoration: BoxDecoration(
                                      border: Border.all(
                                          width: 1, color: hexColor('#cccccc')),
                                      color: hexColor('#e9614d'),
                                      borderRadius:
                                          BorderRadius.circular(10.px)),
                                  child: Text(
                                    '确定',
                                    style: TextStyle(
                                        fontSize: 14,
                                        color: hexColor('#ffffff')),
                                  ),
                                ),
                                onTap: () {
                                  success();
                                },
                              ),
                            ],
                          )
                        ],
                      ),
              ),
            ));
          });
        });
  }
}
